<template>
	<view>
		<view style="background: #fff;">
			<view class="uni-list-cell su-cell">
				<pform type="text" title="收货人" isMust placeholder="请填写收货人姓名" :bind-value.sync="mainData['name']" />
			</view>
			<view class="uni-list-cell su-cell">
				<pform type="text" title="手机号码" isMust placeholder="请输入收货人手机号码" :bind-value.sync="mainData['tel']" />
			</view>
			<view class="uni-list-cell su-cell">
				<pform type="label" title="所在地" isMust placeholder="请选择所在地区" :bind-value.sync="mainData['address']"/>
				<text class="demofont" >&#xe955;</text>
				<pickerAddress mode="region" />
			</view>
			<view class="uni-list-cell su-cell adtesli">
				<pform type="textarea" titleWidth="200upx" title="详细地址" isMust placeholder="请输入详细地址"
					:bind-value.sync="mainData['detailde']" />
				<text class="demofont address" @click="getaddres">&#xe71e;</text>
			</view>
			<view class="uni-list-cell su-cell">
				<text>设为默认地址</text>
				<switch />
			</view>
			<view class="bottom-div su-border2">
				<button type="warn" class="su-button">删除</button>
				<button type="primary" class="su-button" @click="back()">保存</button>
			</view>
		</view>
	</view>
</template>

<script>
	import pickerAddress from '@/components/su-system/su-picker/picker.vue'
	export default {
		components: {
			pickerAddress
		},
		data() {
			return {
				selectData: [{
					name: "名称1",
					code: "name1"
				}, {
					name: "名称2",
					code: "name2"
				}],
				mainData: {
					name: "",
					tel: "",
					address: "",
					detailde: ""
				},
			}
		},
		onLoad(option) {
			// this.mainData= JSON.parse(option.item)
			// console.log(this.mainData)
			if (option.item != undefined) {
				let options = JSON.parse(option.item)
				console.log(options)
				this.mainData = options
			}
		},
		methods: {
			//获取地址
			getaddres() {
				uni.chooseLocation({
					success: function (res) {
					        console.log('位置名称：' + res.name);
					        console.log('详细地址：' + res.address);
					        console.log('纬度：' + res.latitude);
					        console.log('经度：' + res.longitude);
							this.mainData.detailde = res.name +  res.address
					    }
				})
			},
			back() {
				uni.navigateTo({
					url: "../address/address"
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	page {
		background-color: $default-back;
	}

	.su-form-comp {
		align-items: end;
	}

	.bottom-div {
		position: fixed;
		bottom: 0;
		left: 0;
		right: 0;
		padding: 25upx 30upx;
		background-color: #fff;
		display: flex;
		.su-button{
			width: 50%;
			margin: 0 30upx;
		}
	}

	.adtesli {
		.address {
			position: absolute;
			top: 30upx;
			right: 20upx;
			font-size: 50upx;
			color: #000;
		}
	}

	/deep/ .uni-textarea-wrapper {
		width: 88% !important;
		margin-left: 50upx;
	}

	
</style>
